import { request } from "../../request/index.js";
import regeneratorRuntime, { async } from '../../lib/runtime/runtime';

Page({

  /**
   * 页面的初始数据
   */
  data: {
    arr: [[], []],
    // 数据是否请求完
    isEnd: false
  },

  // 接口要的参数
  QueryParams:{
    current: 1,
    limit: 4
  },

  totalPages: 1,

  // 左右瀑布的高度
  heightArr: [0, 0],

  // 获取数据+瀑布流布局
  async layout () {
    const { data: res } = await request({
      url: '/animal/queryAll',
      data: this.QueryParams
    })
    this.totalPages = Math.ceil(res.totalRecordsNum / this.QueryParams.limit)
    let arr = [[], []]
    let min = 0;
    for (let i=0; i<res.animalList.length; i++) {
        if (this.heightArr[0] <= this.heightArr[1]) {
          min = 0
        } else min = 1
      arr[min].push(res.animalList[i]);
      this.heightArr[min] += res.animalList[i]["aspectRatio"] - 0
    }
    //更新左右两栏的数据
    this.setData ({
      arr: [[...this.data.arr[0], ...arr[0]], [...this.data.arr[1], ...arr[1]]]
    })
  },

  //以本地数据为例，实际开发中数据整理以及加载更多等实现逻辑可根据实际需求进行实现   
  onLoad: function(options) {
    this.layout()
  },

  // 页面上滑 滚动条触底事件
  onReachBottom () {
    //  1 判断还有没有下一页数据
    if(this.QueryParams.current>=this.totalPages) {
      // 没有下一页数据
      this.setData ({
        isEnd: true
      })
    } else {
      // 还有下一页数据
      this.QueryParams.current++;
      this.layout();
    }
  },

  // 下拉刷新事件 
  onPullDownRefresh(){
    // 1 重置数组
    this.setData({
      arr: [[], []],
      // 数据是否请求完
      isEnd: false
    })
    // 2 重置页码
    this.QueryParams.current=1;
    // 3 发送请求
    this.layout();
  }
  
})